<template>
	<view class="content">
		<g-content-navbar :title="title"></g-content-navbar>
		<u-parse :html="content" :selectable="true" :show-with-animation="true"></u-parse>
	</view>
</template>

<script>
	import Storage from '@/common/Storage.js'
	export default {
		computed: {},
		data() {
			return {
				info: {},
				title: '',
				content: ''
			}
		},
		onLoad(option) {
			if (option.id) {
				this.renderContentById(option.id)
			} else if (option.type) {
				this.renderContentByType(option.type)
			}

		},
		watch: {
			info: {
				handler(newVal) {
					if (newVal) {
						this.title = newVal.title
						this.content = newVal.content
					}
				},
				deep: true
			}
		},
		methods: {
			renderContentById(id) {
				let key = 'pages_public_content.option.id.' + id
				Storage.get(key, (res) => {
					this.info = JSON.parse(JSON.stringify(res))
					this.$post({
						url: '/content/info',
						data: {
							id: id
						},
						success: (data) => {
							if (JSON.stringify(data) !== JSON.stringify(this.info)) {
								this.info = JSON.parse(JSON.stringify(data))
								Storage.set(key, data)
							}
						}
					})
				}, () => {
					this.$post({
						url: '/content/info',
						data: {
							id: id
						},
						success: (data) => {
							if (data && data.id) {
								this.info = data
								Storage.set(key, data)
							} else {
								this.info = {}
							}
						}
					})
				})
			},
			renderContentByType(type) {
				let key = 'pages_public_content.option.type.' + type
				Storage.get(key, (res) => {
					this.info = JSON.parse(JSON.stringify(res))
					this.$post({
						url: '/content/info',
						data: {
							type: type
						},
						success: (data) => {
							if (JSON.stringify(data) !== JSON.stringify(this.info)) {
								this.info = JSON.parse(JSON.stringify(data))
								Storage.set(key, data)
							}
						}
					})
				}, () => {
					this.$post({
						url: '/content/info',
						data: {
							type: type
						},
						success: (data) => {
							this.info = data
							Storage.set(key, data)
						}
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		min-height: 100vh;
		background-color: #FFFFFF;
	}
</style>
